<?php
/**
 * 博客最新文章组件
 * 用于展示博客中的最新文章
 */
$configKey = isset($configKey) ? $configKey : 'blog-latest';
// 从页面配置获取博客最新文章组件配置，使用默认值作为后备
$data = array_merge([
    'section_id' => 'blog-latest',
    'section_pretitle' => '最新文章',
    'section_title' => '最新文章',
    'section_subtitle' => '最新文章',
    'icon' => 'fa-clock-o',
    'border_radius' => 'xl',
    'shadow' => 'sm',
    'hover_effect' => 'blog-card-hover',
    'items' => [
        [
            'id' => 3,
            'title' => '提升网站加载速度的10个实用技巧',
            'category' => 'web-dev',
            'category_name' => '网页开发',
            'author' => [
                'name' => '王强',
                'avatar' => 'https://picsum.photos/seed/author3/100/100'
            ],
            'date' => '2023-06-10',
            'read_time' => '6 分钟',
            'image' => 'https://picsum.photos/seed/blog3/400/300',
            'image_alt' => '网站性能分析图表',
            'comments' => 12
        ]
    ],
    'pagination' => [
        'current_page' => 1,
        'total_pages' => 5,
        'show_pages' => 3
    ],
    'space_y' => '8',
    'title_margin_bottom' => '8',
    'content_padding' => '6',
    'read_more_text' => '阅读更多',
    'read_more_icon' => 'fa-long-arrow-right'
], $pageConfig['components'][$configKey] ?? []);

// 处理激活分类和标签
$activeCategory = $_GET['category'] ?? 'all';
$activeTag = $_GET['tag'] ?? '';

// 构建URL参数
$urlParams = [];
if ($activeCategory !== 'all') {
    $urlParams[] = 'category=' . $activeCategory;
}
if (!empty($activeTag)) {
    $urlParams[] = 'tag=' . $activeTag;
}
$urlQuery = !empty($urlParams) ? '?' . implode('&', $urlParams) : '';
?>

<!-- 最新文章 -->
<div id="<?= $data['section_id'] ?>">
    <h2 class="text-2xl font-bold mb-<?= $data['title_margin_bottom'] ?> flex items-center">
        <span class="bg-<?= $data['tag_color'] ?>/10 text-<?= $data['tag_color'] ?> p-2 rounded-lg mr-3">
            <i class="fa <?= $data['icon'] ?>"></i>
        </span>
        <?= $data['section_title'] ?>
    </h2>
    
    <div class="space-y-<?= $data['space_y'] ?>>
        <?php foreach ($data['items'] as $post): ?>
            <article class="bg-<?= $data['bg_color'] ?> rounded-<?= $data['border_radius'] ?> overflow-hidden shadow-<?= $data['shadow'] ?> <?= $data['hover_effect'] ?>>
                <a href="/blog/<?= $post['id'] ?><?= $urlQuery ?>" class="block">
                    <div class="md:flex">
                        <div class="md:w-1/3 relative h-48 md:h-auto">
                            <img 
                                src="<?= htmlspecialchars($post['image']) ?>" 
                                alt="<?= htmlspecialchars($post['image_alt']) ?>"
                                class="w-full h-full object-cover transition-transform duration-500 hover:scale-110"
                            >
                            <div class="absolute top-4 left-4">
                                <span class="tag-pill text-gray-800">
                                    <?= htmlspecialchars($post['category_name']) ?>
                                </span>
                            </div>
                        </div>
                        
                        <div class="md:w-2/3 p-<?= $data['content_padding'] ?>>
                            <h3 class="text-xl font-bold mb-3 hover:text-primary transition-colors">
                                <?= htmlspecialchars($post['title']) ?>
                            </h3>
                            
                            <div class="flex justify-between items-center mb-4">
                                <div class="flex items-center">
                                    <img 
                                        src="<?= htmlspecialchars($post['author']['avatar']) ?>" 
                                        alt="<?= htmlspecialchars($post['author']['name']) ?>"
                                        class="w-8 h-8 rounded-full mr-2 object-cover"
                                    >
                                    <span class="text-sm text-gray-700">
                                        <?= htmlspecialchars($post['author']['name']) ?>
                                    </span>
                                </div>
                                
                                <div class="flex items-center text-sm text-gray-500 space-x-3">
                                    <span class="flex items-center">
                                        <i class="fa fa-calendar-o mr-1"></i>
                                        <?= htmlspecialchars(date('M d, Y', strtotime($post['date']))) ?>
                                    </span>
                                    <span class="flex items-center">
                                        <i class="fa fa-clock-o mr-1"></i>
                                        <?= htmlspecialchars($post['read_time']) ?>
                                    </span>
                                    <span class="flex items-center">
                                        <i class="fa fa-comment-o mr-1"></i>
                                        <?= $post['comments'] ?>
                                    </span>
                                </div>
                            </div>
                            
                            <div class="flex justify-end">
                                <span class="text-primary font-medium hover:underline flex items-center">
                                    <?= $data['read_more_text'] ?>
                                    <i class="fa <?= $data['read_more_icon'] ?> ml-2"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                </a>
            </article>
        <?php endforeach; ?>
    </div>
</div>